<template>

    <div class="common-layout">
        <el-container>
          <el-aside width="500px">
            <el-table :data="tableStop"  style="width:500px">
        <el-table-column prop="approverName" label="审批人" width="150px" />
        <el-table-column prop="approvaStatus" label="状态"  width="150px" />
        <el-table-column prop="remark" label="原因"  width="200px" />
      </el-table> 
          </el-aside>
          <el-main style="margin-left: 200px;">
    
         
     
          </el-main>
        </el-container>
      </div>
    
    
      </template>
      
      <script lang="ts" setup>
    import { ref, computed, onMounted, onUnmounted,reactive} from 'vue';
      import { ElMessage, type ComponentSize, type FormInstance, type FormRules } from 'element-plus'
      import axios from 'axios'
      import {useRouter,useRoute} from 'vue-router'
    import {useCounterStore} from '@/stores/counter'
    let router=useRouter();
    let route=useRoute();
    let Store=useCounterStore();
    
      
      const formSize = ref<ComponentSize>('default')
      const ruleFormRef = ref<FormInstance>()
     
    const tableStop=ref([]);
    const tablepost=ref([])
    const page=reactive({
        DepenmentId:Store.CurrLoginUser.depenmentId,
        LeaveApplicationId:route.query.id
    })
    
    onMounted(()=>{
        shangji();
    })
    
    
    const shangji=()=>{
  axios({
    url:'http://localhost:5284/api/Level/QueryAppro',
    method:'get',
    params:page
  })
  .then(res=>{
    console.log('查看审批状态数据',page)
    if(res.data.list!=null){
        console.log(res)
      tableStop.value=res.data.list;
    }
  })
}

    
    
    
    
    
      </script>
    <style scoped>
    .time-section {
      margin-bottom: 12px;
      margin-left: 5px;
    }
    
    .time-label {
      margin-right: 8px;
      min-width: 28px;
      display: inline-block;
    }
    
    .duration-info {
      margin: 8px 0 12px 5px;
      color: #409eff;
      font-size: 14px;
    }
    
    :deep(.el-form-item__content) {
      display: block !important;
    }
    
    /* 响应式处理 */
    @media (max-width: 768px) {
      .el-date-picker {
        width: 100% !important;
      }
      
      .time-label {
        margin-bottom: 4px;
        display: block;
      }
    }
    
    </style>
    <style scoped>
    .leave-apply-container {
      padding: 20px;
    }
    </style>
      